<template>
  <div class="lj-update">
    <div class="header">
      <slot name="header" />
    </div>

    <slot name="main" />

    <div class="lj-btn">
      <LjButton content="更新" type="success" />
      <LjButton content="取消" type="info" @click="$emit('closed')" />
    </div>
  </div>
</template>

<script setup lang="ts">
import LjButton from '@/components/button/LjButton.vue'

const emit = defineEmits(['closed'])
</script>

<style scoped lang="scss">
.lj-update {
  @apply text-[Consolas];
  .header {
    @apply h-[100px] bg-[#8e44ad] mb-[10px] flex flex-col justify-center text-lg text-white pl-[20px] rounded-[2px] shadow-sm;
  }
  .lj-btn {
    @apply mt-[10px] flex justify-end gap-2;
  }
  .lj-input {
    @apply w-[120px];
  }
}
</style>
